<template>
  <SLayout>
<!--    <SearchForm ref="searchRef" @search="flushedTable" />-->
    <SLayoutContent>
      <n-card>
        <Toolbar  ref="toolRef" @getDataList="()=>tableRef?.getList()"/>
        <SDataTable
            ref="tableRef"
            type="page"
            :columns="columns"
            @getData="getData"
            option
            :update-click="updateClick"
            :delete-click="deleteClick"
            :disabled-delete="disabledDelete"
        />
      </n-card>
<!--      <Drawer v-model:drawerShow="drawerShow" :selected="selected"/>-->
    </SLayoutContent>
  </SLayout>
</template>
<script setup name="SM-USER">
import Toolbar from "@/views/admin/sys/user/toolbar/Toolbar.vue";
import SLayoutContent from "@/components/ExtLayout/SLayoutContent.vue";
import SearchForm from "@/views/admin/sys/dict/SearchForm.vue";
import SLayout from "@/components/ExtLayout/SLayout.vue";
import SDataTable from "@/components/public/SDataTable.vue";
import Drawer from "@/views/admin/sys/dict/drawer/index.vue";
import {h} from "vue";
import {NBadge, NButton, NSpace} from "naive-ui";
import {queryUserList} from "@/api/system/userApi";

const searchRef =ref();
const tableRef =ref();

const toolRef =ref();
function updateClick(row){
  toolRef.value?.openEdit(row,row.id)
}
const columns = [
  {
    title: '昵称',
    key: 'name',
    width:50,
  },
  {
    title: '用户名',
    key: 'username',
    width:100,
  },
  {
    title: '性别',
    key: 'sex',
    render(row){
      return row.sexVo?.name
    }
  },
  {
    title: '邮箱',
    key: 'email',
  },
  {
    title: '用户类型',
    key: 'userType',
    render(row){
      return row.userTypeVo?.name
    }
  },
  {
    title: '生日',
    key: 'birthday',
  }
]

function deleteClick(){

}
function disabledDelete(row){
  return row.userType === 'admin'
}
function getData(callback,page,pageSize){

  queryUserList(page,pageSize).then(res=>{
    callback(res.data || {})
  })

}
</script>